<%@ page language="java" pageEncoding="utf-8"%>
<%@page import="com.farm.web.constant.FarmConstant"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="/view/conf/farmtag.tld" prefix="PF"%>

<style>
.wcp-tree-node {
	margin-left: 1.2em;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.wcp-tree-lable {
	color: #f0dda5;
	font-size: 14px;
	white-space: nowrap;
	padding-top: 4px;
	padding-bottom: 4px;
}

.file .wcp-tree-lable {
	color: #b4b6b8;
	white-space: nowrap;
	cursor: pointer;
	font-size: 14px;
}

.file .wcp-tree-lable:hover span {
	color: #ffffff;
}

.wcp-tree-lable .tag {
	margin-right: 0.5em;
}

.wcp-tree-lable .tag.none {
	margin-right: 1.7em;
}

.wcp-tree-node .setting {
	color: #575a63;
	margin-left: 0.2em;
	cursor: pointer;
}

.wcp-tree-node .setting:hover {
	color: #cfcfd7;
}

.errorMsgClass {
	color: #d67a7b;
	margin: 4px;
}
</style>

<div style="padding: 1em;height: 100%;overflow: auto;" id="cbtg-filesBox">
	<div class="wcp-tree-node" data-id="NONE" data-name="${template.name}"
		style="margin-left: 0px; overflow: auto; padding-bottom: 20px;">
		<div class="wcp-tree-lable">
			<i class="glyphicon glyphicon-inbox tag"></i><span>${template.name }</span>
			<i class="glyphicon glyphicon-cog setting" onclick="dirMenusOn(this)"></i>
			<i class="glyphicon glyphicon-refresh setting"
				onclick="refrashFiles()"></i>
		</div>
		<div class="wcp-tree-subnode" id="remote-template-files-id"
			style="margin-left: -20px;"></div>
		<!-- 
		<div class="wcp-tree-node" data-id="32id" data-type="file|dir"
			data-fold="true">
			<div class="wcp-tree-lable">
				<i class="glyphicon glyphicon-plus"></i> <i
					class="glyphicon glyphicon-folder-close"></i><span>farm</span>
			</div>
			<div class="wcp-tree-subnode"></div>
		</div>
		-->
	</div>
</div>

<script type="text/javascript">
	//当前点击树形目录和文件时缓存当前id（可以时文件夹或文件）
	var currentFilesId = "NONE";
	//当前点击的文件（没有打开时，只是点击）
	var editFileId = "NONE";
	//当前打开的文件id（在编辑器和信息栏中打开的文件）
	var cbtg_template_file_id;

	$(function() {
		//初始化目录文件树
		refrashFiles();
	});

	//点击文件
	function tfileOn(cdom) {
		var elements = $(cdom).closest('.wcp-tree-node');
		editFileId = $(elements).attr('data-id');
		var openAble = true;
		if (cbtg_template_file_id == editFileId) {
			openAble = false
		}

		if ($('#fileStateId').html() != "" && openAble && cbtg_template_file_id) {
			if (confirm("是否关闭当前文件(未保存)，并打开新文件？")) {
				openAble = true
			} else {
				openAble = false
			}
		}

		if (openAble) {
			cbtg_template_file_id = editFileId;
			//加载文件信息
			{
				$('#cbtg_file_info_box_id').html("...");
				$('#cbtg_file_info_box_id').load(
						'temveiw/loadFileInfo.do?templateFileId=' + editFileId);
			}
			//加载文本编辑器
			{
				loadEditorText(editFileId);
			}
		}
	}

	//删除目录或文件
	function delDirOrFile() {
		$('#dirFilesShortMenusWinId').modal('hide');
		var elements = $('[data-id="' + currentFilesId + '"]',
				'#remote-template-files-id');
		var type = $(elements).attr("data-type");
		var name = $(elements).attr("data-name");
		if (confirm(" 是否立即删除" + type + "《" + name + "》")) {
			var url;
			if (type == 'file') {
				url = 'temveiw/delfile.do';
			}
			if (type == 'dir') {
				url = 'temveiw/deldir.do';
			}
			$.post(url, {
				'templateid' : "${template.id}",
				"id" : currentFilesId
			}, function(flag) {
				if (flag.STATE == 0) {
					refrashFiles();
				} else {
					alert(flag.MESSAGE);
				}
			}, 'json');
		}
	}
	//刷新目录树
	function refrashFiles() {
		$('#remote-template-files-id').html('');
		$.post('temveiw/loadfiles.do', {
			'templateid' : "${template.id}"
		}, function(flag) {
			if (flag.STATE == 0) {
				$(flag.dirs).each(function(i, node) {
					showDir(node.parentid, {
						'id' : node.id,
						'name' : node.name,
						'sort' : node.sort,
						'note' : node.pcontent
					}, false);
				});
				$(flag.files).each(function(i, node) {
					showDir(node.dirid, {
						'id' : node.id,
						'name' : node.filename,
						'note' : node.pcontent
					}, true);
				});
			} else {
				alert(flag.MESSAGE);
			}
		}, 'json');
	}

	function dirMenusOn(cdom) {
		currentFilesId = $(cdom).closest('.wcp-tree-node').attr('data-id');
		var isFile = $(cdom).closest('.wcp-tree-node').attr('data-type') == 'file';
		if (isFile) {
			//文件
			$('#button-del-file').show();
			$('#button-add-dir').hide();
			$('#button-del-dir').hide();
			$('#button-add-file').hide();
			$('#button-edit-file').show();
			$('#button-choosedir-file').show();
			$('#button-edit-dir').hide();
		} else {
			//文件夾
			$('#button-del-file').hide();
			$('#button-add-dir').show();
			$('#button-del-dir').show();
			$('#button-add-file').show();
			$('#button-edit-file').hide();
			$('#button-choosedir-file').hide();
			$('#button-edit-dir').show();
		}
		if (currentFilesId == 'NONE') {
			$('#button-del-dir').hide();
		}
		$('#dirFilesShortMenusWinId').modal('show');
	}

	//创建文件夹
	function creatDirWin() {
		$('#dirFilesShortMenusWinId').modal('hide')
		$('#exampleModalLabel', '#dirFilesWinId').html(
				"选定目录：" + getFileNodeName());
		$('#file-model', '#dirFilesWinId').html("目录");
		$('#file-model-isfile', '#dirFilesWinId').val(false);
		$('#file-sort-box').show();
		$('#dirFilesWinId').modal({
			'backdrop' : false
		});
		dirFilesWinSubmitFunc = function() {
			creatFile();
		}
	}

	//创建文件
	function creatFileWin() {
		$('#dirFilesShortMenusWinId').modal('hide')
		$('#exampleModalLabel', '#dirFilesWinId').html(
				"选定目录：" + getFileNodeName());
		$('#file-model', '#dirFilesWinId').html("文件");
		$('#file-model-isfile', '#dirFilesWinId').val(true);
		$('#dirFilesWinId').modal({
			'backdrop' : false
		});
		$('#file-sort-box').hide();
		dirFilesWinSubmitFunc = function() {
			creatFile();
		}
	}
	//选择一个目录
	function chooseFileDir() {
		$('#dirFilesShortMenusWinId').modal('hide')
		$('#dirFilesTreeWinId').modal({
			'backdrop' : true
		});
		initChooseTree();
		chooseDirNodeBackFunction = function(dirid) {
			$.post('temveiw/moveFileToDir.do', {
				"templateFileId" : currentFilesId,
				"templateDirId" : dirid,
			}, function(flag) {
				if (flag.STATE == 0) {
					refrashFiles();
					$('#dirFilesTreeWinId').modal('hide');
				} else {
					alert(flag.MESSAGE);
				}
			}, 'json');
		}
	}

	//修改目录名称
	function renameDirWin() {
		//currentFilesId  文件id
		$('#dirFilesShortMenusWinId').modal('hide')
		$('#exampleModalLabel', '#dirFilesWinId').html(
				"选定目录：" + getFileNodeName());
		$('#file-model', '#dirFilesWinId').html("目录");
		$('#file-model-isfile', '#dirFilesWinId').val(false);
		$('#dirFilesWinId').modal({
			'backdrop' : false
		});
		$('#file-name').val(getFileNodeName());
		dirFilesWinSubmitFunc = function() {
			initValidateFilesForm();
			if (!validate('filesSubmitFormId')) {

			} else {
				$.post('temveiw/editDir.do', {
					"templateDirId" : currentFilesId,
					"name" : $('#file-name').val(),
					"sort" : $('#file-sort').val(),
					"note" : $('#file-note').val()
				}, function(flag) {
					if (flag.STATE == 0) {
						refrashFiles();
						$('#dirFilesWinId').modal('hide');
					} else {
						alert(flag.MESSAGE);
					}
				}, 'json');
			}
		}
	}

	//修改文件名称
	function renameFileWin() {
		//currentFilesId  文件id
		$('#dirFilesShortMenusWinId').modal('hide')
		$('#exampleModalLabel', '#dirFilesWinId').html(
				"选定文件：" + getFileNodeName());
		$('#file-model', '#dirFilesWinId').html("文件");
		$('#file-model-isfile', '#dirFilesWinId').val(true);
		$('#dirFilesWinId').modal({
			'backdrop' : false
		});
		$('#file-sort-box').hide();
		$('#file-note-box').hide();
		$('#file-name').val(getFileNodeName());
		dirFilesWinSubmitFunc = function() {
			initValidateFilesForm();
			if (!validate('filesSubmitFormId')) {

			} else {
				$.post('temveiw/saveFileName.do', {
					"templateFileId" : currentFilesId,
					"name" : $('#file-name').val(),
				}, function(flag) {
					if (flag.STATE == 0) {
						refrashFiles();
						$('#dirFilesWinId').modal('hide');
					} else {
						alert(flag.MESSAGE);
					}
				}, 'json');
			}
		}
	}

	//获得当前触发菜单的节点name
	function getFileNodeName() {
		var elements = $('[data-id="' + currentFilesId + '"]',
				'#remote-template-files-id');
		var name = $(elements).attr("data-name");
		if(!name){
			name=currentFilesId;
		}
		return name;
	}

	//创建一个文件或目录
	function creatFile() {
		initValidateFilesForm();
		if (!validate('filesSubmitFormId')) {

		} else {
			creatRemoteFile(currentFilesId, {
				name : $('#file-name').val(),
				sort : $('#file-sort').val(),
				note : $('#file-note').val()
			}, $('#file-model-isfile', '#dirFilesWinId').val() == 'true');
			$('#dirFilesWinId').modal('hide');
		}
	}

	//创建远程文件或目录
	function creatRemoteFile(nodeId, node, isfile) {
		if (isfile) {
			$.post('temveiw/creatfile.do', {
				"templateid" : "${template.id}",
				"name" : node.name,
				"dirid" : nodeId,
				"note" : node.note
			}, function(flag) {
				if (flag.STATE == 0) {
					showDir(flag.node.dirid, {
						'id' : flag.node.id,
						name : flag.node.filename,
						note : flag.node.pcontent
					}, isfile)
				} else {
					alert(flag.MESSAGE);
				}
			}, 'json');
		} else {
			$.post('temveiw/creatdir.do', {
				"templateid" : "${template.id}",
				"name" : node.name,
				"sort" : node.sort,
				"parentid" : nodeId,
				"note" : node.note
			}, function(flag) {
				if (flag.STATE == 0) {
					showDir(nodeId, {
						'id' : flag.node.id,
						name : flag.node.name,
						sort : flag.node.sort,
						note : flag.node.pcontent
					}, isfile)
				} else {
					alert(flag.MESSAGE);
				}
			}, 'json');
		}
	}

	function showDir(nodeId, node, isfile) {
		var elements = $('[data-id="' + nodeId + '"]', '#cbtg-filesBox');
		var dH = "";
		if (isfile) {
			dH = dH
					+ '<div class="wcp-tree-node file" data-name="'+node.name+'" data-id="'+node.id+'" data-type="file" data-fold="true">';
		} else {
			dH = dH
					+ '<div class="wcp-tree-node dir"  data-name="'+node.name+'" data-id="'+node.id+'" data-type="dir" data-fold="true">';
		}
		dH = dH + '<div class="wcp-tree-lable" title="'+node.note+'">';
		if (isfile) {
			dH = dH + '<i class="none tag"></i> ';
			dH = dH
					+ '<i onclick="tfileOn(this)" class="f-model glyphicon glyphicon-list-alt tag"></i>';
			dH = dH + '<span onclick="tfileOn(this)">' + node.name + '</span>';
		} else {
			dH = dH + '<i class="f-fold none tag"></i> ';
			dH = dH
					+ '<i class="f-model glyphicon glyphicon-folder-close tag"></i>';
			dH = dH + '<span>' + node.name + '</span>';
		}

		dH = dH
				+ '<i class="glyphicon glyphicon-cog setting" onclick="dirMenusOn(this)"></i>';
		dH = dH + '</div>';
		dH = dH + '<div class="wcp-tree-subnode"></div>';
		dH = dH + "</div>";
		$(elements).children('.wcp-tree-subnode').append(dH);
	}

	//展开目录
	function openDir(nodeId, isTrue) {
		var elements = $('[data-id="' + nodeId + '"]', '#cbtg-filesBox');
		if (isTrue == null) {
			$(elements).children('.wcp-tree-lable').children('.f-fold')
					.addClass('none');
			$(elements).children('.wcp-tree-lable').children('.f-fold')
					.removeClass('glyphicon-plus');
			$(elements).children('.wcp-tree-lable').children('.f-fold')
					.removeClass('glyphicon-minus');
			$(elements).children('.wcp-tree-lable').children('.f-fold')
					.removeClass('glyphicon');
		} else {
			if (isTrue) {
				$(elements).children('.wcp-tree-lable').children('.f-fold')
						.addClass('glyphicon');
				$(elements).children('.wcp-tree-lable').children('.f-fold')
						.addClass('glyphicon-minus');
				$(elements).children('.wcp-tree-lable').children('.f-fold')
						.removeClass('glyphicon-plus');
				$(elements).children('.wcp-tree-lable').children('.f-fold')
						.removeClass('none');
			} else {
				$(elements).children('.wcp-tree-lable').children('.f-fold')
						.addClass('none');
				$(elements).children('.wcp-tree-lable').children('.f-fold')
						.removeClass('glyphicon-plus');
				$(elements).children('.wcp-tree-lable').children('.f-fold')
						.removeClass('glyphicon-minus');
				$(elements).children('.wcp-tree-lable').children('.f-fold')
						.removeClass('glyphicon');
			}
		}

	}
</script>